 <template>
 	<!-- 
		企业拓客权限相关：3个购买弹窗 1.信息会员+查人脉  2.查人脉  3.未登录 20250328
		
		使用 public/ValidateAutMoHandler.ashx 接口进行判断及显示对应的弹窗；，、
			- 请求参数：mids参数需多传1（招中标详情查看权限，代表至少是个移动端标准会员）：mids: 1,247,251,248,252,253,254,255,256
			- 返回参数：
				- ”1“的isallow为false 弹购买信息会员+查人脉,showBuyxinxi设置为true
				- “1”的isallow为true,说明有会员权限，在判断255权限，如果255的isAllow是true，则什么都不弹 ，否则弹购买查人脉,showBuycharenmai设置为true
			- 注意：弹窗中文字是“信息会员”，所以接口中传”1“判断，如果是“高级会员”+查人脉，需找后端进行沟通，看传哪个参数，价格写死by帅帅		
	 -->
 	<view>
 		<!-- 信息会员+查人脉弹窗 -->
 		<up-popup :show="isNeedQuanxian" mode="center" customStyle="width:640rpx;"
 			:bgColor="!showLogin ? 'transparent':'#fff'">
 			<template v-if="showLogin">
 				<view class=" ">
 					<image src="@/static/img/tuoke/close.png" class="closeBtn" @click="close"></image>
 					<view class="loginWrap">
 						<image src="@/static/img/tuoke/nologin.png" mode="widthFix" style="width:250rpx;"></image>
 						<view class="login-text">您当前为游客状态，暂时无法使用该功能</view>
 						<view class="loginbtn" @click="toLogin">免费注册</view>
 						<view class="login-bottom">已有帐号，<text @click="toLogin">前往登录</text></view>
 					</view>
 				</view>
 			</template>
 			<template v-else-if="showBuyxinxi">
 				<view class="xinxi">
 					<image src="@/static/img/tuoke/close.png" class="closeBtn" @click="close"></image>
 					<view class="tip" v-show="popupfrom !='qiqing'">今日免费试用权限已用尽！</view>
 					<view class="title" :style="{paddingTop:popupfrom =='qiqing' ?'94rpx' :0}">立即开通<text>企业拓客</text>功能</view>
 					<view class="gongneng">
 						<view class="gongneng1">
 							<view>
 								·信息会员
 							</view>
 							<view>
 								·招投标信息
 							</view>
 						</view>
 						<image src="@/static/img/tuoke/jiahao.png" mode=""></image>
 						<view class="gongneng2">
 							<view>
 								·查人脉
 							</view>
 							<view>
 								·企业联系方式
 							</view>
 						</view>
 					</view>
 					<view class="gongnengList">
 						<view class="item">
 							<image src="@/static/img/tuoke/qyfx.png" mode=""></image>
 							<view>企业分析</view>
 						</view>
 						<view class="item">
 							<image src="@/static/img/tuoke/ywtk.png" mode=""></image>
 							<view>业务拓客</view>
 						</view>
 						<view class="item">
 							<image src="@/static/img/tuoke/mcxk.png" mode=""></image>
 							<view>名称寻客</view>
 						</view>
 						<view class="item">
 							<image src="@/static/img/tuoke/jgdh.png" mode=""></image>
 							<view>机构电话</view>
 						</view>
 						<view class="item">
 							<image src="@/static/img/tuoke/qyxx.png" mode=""></image>
 							<view>企业信息</view>
 						</view>
 					</view>
 					<view class="kaitong-box">
 						<view class="zuidizhixu">最低只需</view>
 						<view class="lijikaitong" @click="lijikaitong('xinxi')">
 							<text class="xianjia">￥149.9</text>
 							<text class="yuanjia">￥219.9</text>
 							<text>立即开通</text>
 						</view>
 					</view>
 				</view>
 			</template>
 			<template v-else-if="showBuycharenmai">
 				<view class="charenmai">
 					<image src="@/static/img/tuoke/close.png" class="closeBtn" @click="close"></image>
 					<view class="tip" v-show="popupfrom !='qiqing'">今日免费试用权限已用尽！</view>
 					<view class="title" :style="{paddingTop:popupfrom =='qiqing' ?'86rpx' :0}">立即开通<text>查人脉</text>功能</view>
 					<view class="gongneng">
 						<view class="quanyi">
 							查人脉3大权益
 						</view>
 					</view>
 					<view class="gongnengList">
 						<view class="item">
 							<image src="@/static/img/tuoke/jgdh.png" mode=""></image>
 							<view>机构电话</view>
 						</view>
 						<view class="item">
 							<image src="@/static/img/tuoke/xgzrr.png" mode=""></image>
 							<view>相关责任人</view>
 						</view>
 						<view class="item">
 							<image src="@/static/img/tuoke/xgxm.png" mode=""></image>
 							<view>相关项目</view>
 						</view>
 					</view>
 					<view class="kaitong-box">
 						<view class="zuidizhixu">最低只需</view>
 						<view class="lijikaitong" @click="lijikaitong('charenmai')">
 							<text class="xianjia"><label>￥</label>2.5/家</text>
 							<text class="yuanjia">￥2.99/家</text>
 							<text>立即开通</text>
 						</view>
 					</view>
 				</view>
 			</template>

 		</up-popup>
 	</view>
 </template>

 <script>
 	export default {
 		name: "popup-tuoke",
 		props: {
 			showBuyxinxi: {
 				type: Boolean,
 				default () {
 					return false
 				}
 			},
 			showBuycharenmai: {
 				type: Boolean,
 				default () {
 					return false
 				}
 			},
 			showLogin: {
 				type: Boolean,
 				default () {
 					return false
 				}
 			},
 			isNeedQuanxian: {
 				type: Boolean,
 				default () {
 					return false
 				}
 			},
 			comcode: {
 				type: String,
 				default () {
 					return ""
 				}
 			},
 			vcode: {
 				type: String,
 				default () {
 					return ""
 				}
 			},
 			companyName: {
 				type: String,
 				default () {
 					return ""
 				}
 			},
 			danweiType: {
 				type: String,
 				default () {
 					return "2"
 				}
 			},
 			keywords2: {
 				type: String,
 				default () {
 					return ""
 				}
 			},
			popupfrom: {
 				type: String,
 				default () {
 					return ""
 				}
 			},
 		},
 		data() {

 			return {
			};
 		},
 		mounted() {
		},
 		computed: {},

 		watch: {},
 		methods: {

 			// 关闭信息弹窗
 			close() {
 				this.$emit('update:isNeedQuanxian', false)
 			},

 			// 立即开通
 			lijikaitong(type) {
 				this.$emit('update:isNeedQuanxian', false)
				
				
 				if (type == "xinxi") {
 					//点击跳转到会员支付页面，并选中1个月的移动标准会员，选中拓客功能 带参数tuoke=1
 					uni.navigateTo({
 						url: '/pages/user/huiyuan/payment?tuoke=1'
 					})

 				} else if (type == "charenmai") {
 					//点击跳转到到企业拓客的付费页面--查人脉购买
 					uni.navigateTo({
 						url: '/pages/qiqing/pay/pay?type=' + 255 + '&pageurl=' + '/pages/qiqing/index' +
 							'&comcode=' + this.comcode + '&vcode=' + this.vcode + '&companyName=' + this
 							.companyName + '&danweiType=' + this.danweiType + '&keywords2=' + this.keywords2
 					})

 				}

 			},
 			toLogin() {
 				uni.navigateTo({
 					url: '/pages/user/login/login1?fromurl=' + encodeURIComponent('/pages/tuoke/tuoke')
 				})
 			}
 		}
 	}
 </script>

 <style lang="scss" scoped>
 	.xinxi,
 	.charenmai {
 		padding-bottom: 50rpx;
 		background: url(@/static/img/tuoke/popup-bg.png) center no-repeat;
 		background-size: 100% 100%;
 	}

 	.tip,
 	.title {
 		text-align: center;
 	}

 	.tip {
 		line-height: 94rpx;
 		font-size: 22rpx;
 		color: #F5F7FA;
 	}

 	.title {
 		line-height: 64rpx;
 		font-size: 28rpx;
 		color: #42221E;

 		text {
 			color: #D53320;
 		}
 	}

 	.gongneng {
 		display: flex;
 		align-items: center;
 		justify-content: center;
 		margin-top: 30rpx;

 		image {
 			width: 38rpx;
 			height: 38rpx;
 			margin: 0 24rpx;
 		}

 		.gongneng1,
 		.gongneng2 {
 			padding-top: 10rpx;

 			view {
 				margin-bottom: 10rpx;
 				font-weight: bold;
 				font-size: 26rpx;
 				color: #FFFFFF;
 			}
 		}
 	}

 	.gongneng1 {
 		width: 226rpx;
 		background: linear-gradient(-35deg, #FB8A86 0%, #FB6963 100%);
 		border-radius: 50rpx 0px 50rpx 0px;

 		view {
 			line-height: 40rpx;
 			padding-left: 40rpx;
 		}
 	}

 	.gongneng2 {
 		width: 226rpx;
 		background: linear-gradient(-35deg, #FCA16E 0%, #E87939 100%);
 		border-radius: 50rpx 0px 50rpx 0px;

 		view {
 			padding-left: 28rpx;
 		}
 	}

 	.gongnengList {
 		margin-top: 48rpx;
 		padding: 0 42rpx;
 		display: flex;
 		justify-content: space-between;

 		.item {
 			text-align: center;

 			image {
 				width: 70rpx;
 				height: 70rpx;
 			}

 			view {
 				// margin-top: 10rpx;
 				font-size: 22rpx;
 				color: #983F34;
 			}
 		}
 	}

 	.kaitong-box {
 		margin: 52rpx 70rpx 0;
 		position: relative;

 		.zuidizhixu {
 			width: 121rpx;
 			height: 42rpx;
 			line-height: 42rpx;
 			font-size: 22rpx;
 			color: #F5F7FA;
 			text-align: center;
 			background: #D9412E;
 			border-radius: 20px 0px 20px 0px;
 			position: absolute;
 			left: -40rpx;
 			top: -10rpx;
 		}

 		.lijikaitong {
 			width: 500rpx;
 			height: 100rpx;
 			line-height: 100rpx;
 			text-align: center;
 			background: linear-gradient(-36deg, #FFB985 0%, #FFD3AF 100%);
 			border-radius: 50rpx;
 			display: flex;
 			align-items: center;
 			justify-content: center;

 			.xianjia {
 				font-size: 36rpx;
 				color: #42221E;
 				font-weight: bold;

 				label {
 					font-size: 24rpx;
 				}
 			}

 			.yuanjia {
 				margin-left: 10rpx;
 				font-size: 24rpx;
 				color: #AF908C;
 				text-decoration-line: line-through;
 			}

 			text {
 				&:last-child {
 					margin-left: 36rpx;
 					font-weight: bold;
 					font-size: 36rpx;
 					color: #42221E;
 				}
 			}
 		}
 	}

 	.closeBtn {
 		width: 58rpx;
 		height: 58rpx;
 		position: absolute;
 		right: 20rpx;
 		top: -80rpx;
 	}

 	.charenmai {
 		.tip {
 			line-height: 86rpx;
 		}

 		.title {
 			line-height: 56rpx;
 		}

 		.gongneng {
 			margin-top: 55rpx;
 		}

 		.quanyi {
 			width: 506rpx;
 			height: 80rpx;
 			line-height: 80rpx;
 			font-weight: bold;
 			font-size: 32rpx;
 			color: #FFFFFF;
 			text-align: center;
 			background: linear-gradient(-35deg, #FB8A86 0%, #FB6963 100%);
 			border-radius: 50rpx 0px 50rpx 0px;
 		}

 		.gongnengList {
 			margin: 58rpx 0 0;
 			padding: 0 66rpx;
 		}

 	}

 	.loginWrap {
 		font-size: 26rpx;
 		color: #333333;
 		padding: 47rpx 32rpx 0;
 		text-align: center;

 		.login-text {
 			padding: 37rpx 0;
 		}

 		.loginbtn {
 			background: #2F6DFE;
 			border-radius: 50rpx;
 			width: 540rpx;
 			height: 100rpx;
 			line-height: 100rpx;
 			text-align: center;
 			font-size: 36rpx;
 			color: #FFFFFF;
 		}

 		.login-bottom {
 			padding: 32rpx 0 38rpx;

 			text {
 				color: #FF8038;

 			}
 		}
 	}
 </style>